﻿function showCourseDesignList(){
	var pageSize = 20;
	var showPreview = window.screen.width > 800;

	var store = new Ext.data.Store({
				proxy : new Ext.data.HttpProxy({
							url : url.showCourseDesignList
						}),
				reader : new Ext.data.JsonReader({
							root : 'result',
							totalProperty : 'count',
							id : 'id'
						}, ['id', 'title', 'description'])
			});
	store.on("load", onDesEdit);
	store.load({
				params : {
					start : 0,
					limit : pageSize
				}
			});

	var expander = new Ext.ux.RowExpander({
				tpl : new Ext.Template('<p>{description}</p><br>')
			});
	var cm = new Ext.grid.ColumnModel([{
				header : 'CourseDesign Title',
				sortable : false,
				dataIndex : 'title',
				renderer : titleFormat
			}]);

	var sm = new Ext.grid.RowSelectionModel({
				singleSelect : true
			});
	var toolbar = new Ext.Toolbar({
				items : [new Ext.Button({
									text : '刷新',
									iconCls : 'refresh-icon',
									handler : function() {
										store.reload();
									}
								}), new Ext.Button({
									text : '描述',
									iconCls : 'preview-icon',
									enableToggle : true,
									pressed : showPreview,
									toggleHandler : function(sender, pressed) {
										showPreview = pressed;
										grid.view.refresh();
									}
								}), new Ext.Button({
									text : '提交课程设计',
									iconCls : 'submit-icon',
									disabled : true,
									handler : function() {
										onSubmitCd();
									}
								})]
			});

	var godbuttons;
	if (sys.god || sys.teacher) {
		godbuttons = [new Ext.Toolbar.Separator(), new Ext.Button({
							text : '添加课题',
							iconCls : 'add-icon',
							handler : function() {
								addOrEditCourseDesign({});
							}
						}), new Ext.Button({
							text : '编辑课题',
							iconCls : 'edit-icon',
							handler : onEdit,
							disabled : true
						}), new Ext.Button({
							text : '删除课题',
							iconCls : 'delete-icon',
							handler : onDelete,
							disabled : true
						}), new Ext.Toolbar.Separator(), new Ext.Button({
							text : '添加班级',
							iconCls : 'addclass-icon',
							handler : function() {
								addOrEditClass();
							}
						}), new Ext.Button({
							text : '管理班级',
							iconCls : 'editclass-icon',
							handler : function() {
								selectClass(function(cid) {
											showStudentList(cid);
										});
							}
						}), new Ext.Toolbar.Separator(), new Ext.Button({
							text : '统计课程设计',
							iconCls : 'statistics-icon',
							handler : onStatistics
						})];
		toolbar.add(godbuttons);
	}

	var pagebar = new Ext.PagingToolbar({
				pageSize : pageSize,
				store : store,
				displayInfo : true,
				emptyMsg : '当前没有课题。',
				displayMsg : '当前显示第 {0} - {1} 个实验，共 {2} 个课题。',
				plugins : new Ext.ux.SlidingPager()
			});

	var grid = new Ext.grid.GridPanel({
				id : 'showCourseDesignList',
				title : 'Course Design',
				iconCls : 'experiment-icon',
				closable : false,
				region : 'center',
				loadMask : {
					msg : '载入中...'
				},
				viewConfig : {
					forceFit : true,
					enableRowBody : true,
					showPreview : showPreview,
					getRowClass : previewFormat,
					scrollToRow : function(rowIndex) {
						var firstRow = Ext.get(this.getRow(0));
						var row = Ext.get(this.getRow(rowIndex));
						var distance = row.getOffsetsTo(firstRow)[1];
						this.scroller.dom.scrollTop = distance;
					}
				},
				store : store,
				cm : cm,
				sm : sm,
				tbar : toolbar,
				closable : true,
				bbar : pagebar,
				plugins : expander,
				collapsible : true,
				animCollapse : false
			});
	sm.on('selectionchange', onSelect);
	grid.onRefresh = onRefresh;

	addTab(grid);

	function onRefresh() {
		store.reload();
	}
	function titleFormat(value, p, record) {
		return String.format("{0} {1}",record.data.id, value);
	}

	function previewFormat(record, rowIndex, p) {
		if (showPreview) {
			p.body = String.format('<p>{0}</p>', Ext.util.Format.trim(Ext.util.Format
							.stripTags(record.data.description.replace(/&nbsp;/g, ' ')))
							.gbtrim(window.screen.width > 800 ? 120 : 60));
			return 'x-grid3-row-expanded';
		}
		return
		'x-grid3-row-collapsed';
	}
	function onEdit() {
		var select = getSelect();
		if (!select)
			return;
		addOrEditCourseDesign(select.data);
	}
	function onDelete() {
		var select = getSelect();
		if (!select)
			return;
		deleteCourseDesign({
					id : select.data.id
				});
	}

	function getSelect() {
		if (sm.getCount() == 0)
			return null;
		return sm.getSelected();
	}
	function onSelect() {
		var record = getSelect();
		var disable = !record;
		toolbar.get(2).setDisabled(disable);
		if (record) {
			for (var i = 0; i < store.getCount(); ++i) {
				expander.collapseRow(i);
			}
			var rowIndex = store.indexOf(record);
			if (rowIndex == -1)
				alert("false");
			expander.expandRow(rowIndex);
		}
		if (sys.god || sys.teacher) {
			godbuttons[2].setDisabled(disable);
			godbuttons[3].setDisabled(disable);
		}
	}
	function onDesEdit() {
		for (var i = 0; i < store.getCount(); ++i) {
			store.getAt(i).data.description = store.getAt(i).data.description
					.replace(/\r\n/g, '<br/>');
			store.getAt(i).data.description = store.getAt(i).data.description
					.replace(/\n/g, '<br/>');
		}
	}
	function onStatistics() {
		selectClass(function(cid) {
					showCDStatistics(cid);
				});
	}
	function onSubmitCd(){
		var record = getSelect();
		if(!record)
		return;
		submitCourseDesign(record.data.title);
	}
	function onSubmit(){
		var record = getSelect();
		if (!record)
			return;
		submitCourseDesign(record.data.title);
	}
}